<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../../../images/favicon.ico">

    <title>洲博通 - 阅读邮件 </title>
  
	<!-- Bootstrap 4.0-->
	<link rel="stylesheet" href="../../../assets/vendor_components/bootstrap/dist/css/bootstrap.min.css">
	
	<!-- Bootstrap extend-->
	<link rel="stylesheet" href="../../css/bootstrap-extend.css">
	
	<!-- Theme style -->
	<link rel="stylesheet" href="../../css/master_style.css">

	<!-- 洲博通 skins -->
	<link rel="stylesheet" href="../../css/skins/_all-skins.css">	

	<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
	<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
	<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
	<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
	<![endif]-->

</head>
<body class="sidebar-collapse skin-blue sidebar-mini">
  <b data-toggle="push-menu" style="display:none"></b>
<div class="wrapper">



  <div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <h1>
        阅读邮件
      </h1>
      <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="#"><i class="fa fa-envelope-o"></i> 邮件中心</a></li>
        <li class="breadcrumb-item active">阅读邮件</li>
      </ol>
    </section>

    <!-- Main content -->
    <section class="content">
	  <div class="box">
		<div class="box-body">
		  <div class="row">
			<div class="col-lg-3 col-12">
				<div class="h-p100 p-15 bg-light">
				  <a href="compose.html" class="btn btn-success btn-block btn-shadow margin-bottom">发邮件</a>

				  <div class="box bg-transparent no-border no-shadow">
					<div class="box-header with-border">
					  <h3 class="box-title">文件夹</h3>
					</div>
					<div class="box-body no-padding mailbox-nav">
					  <ul class="nav nav-pills flex-column">
						<li class="nav-item"><a class="nav-link" href="javascript:void(0)"><i class="ion ion-ios-email-outline"></i> 收件箱
						  <span class="label label-success pull-right">12</span></a></li>
						<li class="nav-item"><a class="nav-link" href="javascript:void(0)"><i class="ion ion-paper-airplane"></i> 发送</a></li>
						<li class="nav-item"><a class="nav-link" href="javascript:void(0)"><i class="ion ion-email-unread"></i> 草稿</a></li>
						<li class="nav-item"><a class="nav-link" href="javascript:void(0)"><i class="ion ion-star"></i>  标记 <span class="label label-warning pull-right">14</span></a>
						</li>
						<li class="nav-item"><a class="nav-link" href="javascript:void(0)"><i class="ion ion-trash-a"></i> 废物箱</a></li>
					  </ul>
					</div>
					<!-- /.box-body -->
				  </div>
				  <!-- /. box -->
				  <div class="box bg-transparent no-border no-shadow">
					<div class="box-header with-border">
					  <h3 class="box-title">标签</h3>
					</div>
					<div class="box-body no-padding mailbox-nav">
					  <ul class="nav nav-pills flex-column">
						<li class="nav-item"><a class="nav-link" href="#"><i class="fa fa-circle-o text-red"></i> 重要的</a></li>
						<li class="nav-item"><a class="nav-link" href="#"><i class="fa fa-circle-o text-yellow"></i> 推广</a></li>
						<li class="nav-item"><a class="nav-link" href="#"><i class="fa fa-circle-o text-light-blue"></i> 工作</a></li>
					  </ul>
					</div>
					<!-- /.box-body -->
				  </div>
				  <!-- /.box -->
				</div>
			</div>
			<!-- /.col -->
			<div class="col-lg-9 col-12">
			  <div class="box bg-transparent no-border no-shadow">
				<div class="box-header with-border">
				  <h3 class="box-title">阅读邮件</h3>

				  <div class="box-tools pull-right">
					<a href="#" class="btn btn-box-tool" data-toggle="tooltip" title="Previous"><i class="fa fa-chevron-left"></i></a>
					<a href="#" class="btn btn-box-tool" data-toggle="tooltip" title="Next"><i class="fa fa-chevron-right"></i></a>
				  </div>
				</div>
				<!-- /.box-header -->
				<div class="box-body b-1">
				  <div class="mailbox-read-info">
					<h3>广交会需要准备的资料</h3>
				  </div>
				  <div class="mailbox-read-info clearfix">
					<div class="left-float margin-r-5"><a href="#"><img src="../../../images/1.jpg" alt="user" width="40" class="rounded-circle"></a></div>
					<h5 class="no-margin"> 吴小英<br>
						 <small>来自: 7533524@vmaotong.com</small>
					  <span class="mailbox-read-time pull-right">2019-07-02</span></h5>
				  </div>
				  <!-- /.mailbox-read-info -->
				  <div class="mailbox-controls with-border clearfix mt-15">                
					<div class="left-float">
					  <button type="button" class="btn btn-outline btn-sm" data-toggle="tooltip" title="Print">
					  <i class="fa fa-print"></i></button>
					</div>
					<div class="right-float">
					<div class="btn-group">
					  <button type="button" class="btn btn-outline btn-sm" data-toggle="tooltip" data-container="body" title="Delete">
						<i class="fa fa-trash-o"></i></button>
					  <button type="button" class="btn btn-outline btn-sm" data-toggle="tooltip" data-container="body" title="Reply">
						<i class="fa fa-reply"></i></button>
					  <button type="button" class="btn btn-outline btn-sm" data-toggle="tooltip" data-container="body" title="Forward">
						<i class="fa fa-share"></i></button>
					</div>
					</div>
					<!-- /.btn-group -->

				  </div>
				  <!-- /.mailbox-controls -->
				  <div class="mailbox-read-message">
					<p>Dear all,</p>

					<p>外综备案工厂操作流程请查看附件</p>

					<p>工厂成功备案后，我司业务员或跟单员请发邮件通知财务人员邓嘉南同事去税局备案，申请的邮件上请附上工厂备案好的代办退税情况备案表和我司与工厂签订的外综协议即可。无需提供纸质备案表和协议。财务同事备案好后会回复邮件</p>
					<p>有疑问随时沟通，谢谢配合</p>

					<p>谢谢,<br>吴小英</p>
				  </div>
				  <!-- /.mailbox-read-message -->
				</div>
				<!-- /.box-body -->
				<div class="box-footer">
					<h5><i class="fa fa-paperclip m-r-10 m-b-10"></i> 附件 <span>(3)</span></h5>
				  <ul class="mailbox-attachments clearfix">
					<li>
					  <span class="mailbox-attachment-icon"><i class="fa fa-file-pdf-o"></i></span>

					  <div class="mailbox-attachment-info">
						<a href="#" class="mailbox-attachment-name"><i class="fa fa-paperclip"></i> Mag.pdf</a>
							<span class="mailbox-attachment-size">
							  5,215 KB
							  <a href="#" class="btn btn-default btn-xs pull-right"><i class="fa fa-cloud-download"></i></a>
							</span>
					  </div>
					</li>
					<li>
					  <span class="mailbox-attachment-icon"><i class="fa fa-file-word-o"></i></span>

					  <div class="mailbox-attachment-info">
						<a href="#" class="mailbox-attachment-name"><i class="fa fa-paperclip"></i> Documents.docx</a>
							<span class="mailbox-attachment-size">
							  2,145 KB
							  <a href="#" class="btn btn-default btn-xs pull-right"><i class="fa fa-cloud-download"></i></a>
							</span>
					  </div>
					</li>
					<li>
					  <span class="mailbox-attachment-icon has-img"><img src="../../../images/photo1.png" alt="Attachment"></span>

					  <div class="mailbox-attachment-info">
						<a href="#" class="mailbox-attachment-name"><i class="fa fa-camera"></i> Image.png</a>
							<span class="mailbox-attachment-size">
							  2.67 MB
							  <a href="#" class="btn btn-default btn-xs pull-right"><i class="fa fa-cloud-download"></i></a>
							</span>
					  </div>
					</li>
				  </ul>
				</div>
				<!-- /.box-footer -->
				<div class="box-footer">
				  <div class="pull-right">
					<button type="button" class="btn btn-success"><i class="fa fa-reply"></i> 回复</button>
					<button type="button" class="btn btn-info"><i class="fa fa-share"></i> 转发</button>
				  </div>
				  <button type="button" class="btn btn-danger"><i class="fa fa-trash-o"></i> 删除</button>
				  <button type="button" class="btn btn-warning"><i class="fa fa-print"></i> 打印</button>
				</div>
				<!-- /.box-footer -->
			  </div>
			  <!-- /. box -->
			</div>
			<!-- /.col -->
		  </div>
      		<!-- /.row -->
      	</div>
      </div>
    </section>
    <!-- /.content -->
  </div>


</div>
<!-- ./wrapper -->

	<!-- jQuery 3 -->
	<script src="../../../assets/vendor_components/jquery/dist/jquery.min.js"></script>
	
	<!-- popper -->
	<script src="../../../assets/vendor_components/popper/dist/popper.min.js"></script>
	
	<!-- Bootstrap 4.0-->
	<script src="../../../assets/vendor_components/bootstrap/dist/js/bootstrap.min.js"></script>
	
	<!-- SlimScroll -->
	<script src="../../../assets/vendor_components/jquery-slimscroll/jquery.slimscroll.min.js"></script>
	
	<!-- FastClick -->
	<script src="../../../assets/vendor_components/fastclick/lib/fastclick.js"></script>
	
	<!-- 洲博通 App -->
	<script src="../../js/template.js"></script>
	
	<!-- 洲博通 for demo purposes -->
	<script src="../../js/demo.js"></script>


</body>
</html>
